{extend name="layout" /}
{block name="content"}
<nav class="mui-bar mui-bar-tab footer">
	<div class="">
		<div class="tm-flex">
			<!-- <div class="tm-flex-1">
				<a href="tel:{:config('SERVICE_PHONE')}" class="contact-btn tm-block href">
					<div class="tm-flex flex-pack-center flex-align-center height-all">
						<div class="tm-icon-item">
							<div class="tm-icon">
								<img src="{$images_path}phone-green.png" alt="" width="17" height="17" />
							</div>
							<div class="tm-icon-label">
								<div class="tm-flex-row-xs">
									咨询电话
								</div>
								<div class="tm-flex-row-xs">
									9:00 - 18:00
								</div>
							</div>
						</div>
					</div>
				</a>
			</div> -->
			<div class="tm-flex-1">
				<div class="footer-btn-group">
					<button id="open-layer" type="button" class="mui-btn mui-btn-green mui-btn-block" {eq name="info.kucun" value="0"} disabled {/eq}>立即兑换</button>
				</div>
			</div>
		</div>
	</div>
</nav>
<!--footer end-->
<div class="mui-content">
	<!--swiper-->
	<div class="controll-swiper">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				{volist name="info.acces" id="v"}
				<div class="swiper-slide">
					<a href="javascript:">
						<img src="{$v}" alt="" />
					</a>
				</div>
				{/volist}
			</div>
			<div class="swiper-pagination"></div>
		</div>
	</div>
	<!--swiper end-->
	<div class="tm-label-lg tm-bg-white">
		<div class="main-content">
			<div class="tm-flex-row">
				<div class="tm-inline-1-5">
					{$info.descrip}
				</div>
			</div>
			<div class="tm-flex-row">
				<div class="tm-flex">
					<div class="tm-flex-1">
						<span class="tm-font-yellow tm-mdx-size tm-font-boldx">{$info.price}积分</span>
					</div>
					<div>
						<span class="tm-font-gray tm-df-size">已兑换:{$info.salenums}</span>
					</div>
				</div>
			</div>
		</div>
	</div>

	<!--兑换说明-->
	<div class="uk-clearfix uk-margin-small-top">
		<div class="tm-label-md tm-bg-white">
			<div class="main-content">
				<span class="tm-font-boldx">兑换说明</span>
			</div>
		</div>
		{$info.content}
	</div>
	<!--兑换说明 end-->
</div>
<!--layer-->
<div id="layer" style="display: none;">
	<div class="tm-layer-header tm-default-size tm-font-default">
		<div class="tm-label-lg">
			<div class="main-content">
				<div class="tm-inline-1-5 tm-df-size tm-font-bold">
					确认要兑换该商品吗？
				</div>
			</div>
		</div>
	</div>
	<div class="tm-layer-body">
		<div class="main-content">
			<input type="password" class="tm-small-input" value="" placeholder="输入登录密码确认" name="password" id="password" />
		</div>
	</div>
	<div class="tm-layer-footer">
		<div class="tm-label-lg">
			<div class="main-content-md">
				<div class="to-btn-group">
					<ul class="uk-grid">
						<li class="uk-width-1-2">
							<button id="close-layer" type="button" class="mui-btn mui-btn-block">取消</button>
						</li>
						<li class="uk-width-1-2">
							<button type="button" class="mui-btn mui-btn-green mui-btn-block cocoAjax" ajax-url="{:url('v1/adminuser/check_pwd')}" ajax-data="func" datafun="get_data" ajax-callback="suc_back">确定</button>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</div>
{/block}
{block name="script"}
<script type="text/javascript" src="{$js_path}swiper.min.js"></script>
<script type="text/javascript">
	function get_data() {
		var datajson = {};
		var password = $("#password").val();
		if (!password) {
			coco_msg('密码不能为空');
			return false;
		}
		datajson.password = password;
		datajson.goods_id = {$info.id};
		return datajson;
	}
	function suc_back(obj, data) {
		location.href = "{$app_url}/index/member/choose_address/goods_id/"+{$info.id}+"?token="+token+"&timestamp="+{:time()};
	}
</script>
<script type="text/javascript">
	$(document).ready(function() {
		var swiper = new Swiper('.swiper-container', {
			pagination: '.swiper-pagination',
			paginationClickable: true
		});
		mui(document).on('tap', "#open-layer", function() {
			layer.open({
				type: 1,
				title: false,
				closeBtn: 0,
				skin: 'tm-page-layer',
				shade: 0.5,
				shadeClose: true,
				content: $('#layer')
			});
		})
		//关闭
		mui(document).on("tap", "#close-layer", function() {
			layer.closeAll();
		})
		mui(document).on('tap', '.href', function() {
			window.top.location.href = this.href;
		})
	});
</script>
{/block}